<template>
  <div>
    <h3>computed</h3>
    <div>a:{{ a }}</div>
    <div>b:{{ b }}</div>
    <div>c:{{ c }}</div>
  </div>
</template>

<script setup>
import { ref, computed, onMounted } from 'vue'
onMounted(() => {
  console.log('computed')
})
const a = ref(0)
const b = ref(2)
const c = computed(() => {
  return a.value + b.value
})
setTimeout(() => {
  a.value++
  console.log(c.value)
}, 1000)
</script>

<style scoped></style>
